<%@ include file="/include/taglibs.jsp" %>
<%@ page language="java" pageEncoding="utf-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<jsp:useBean id="dateValue" class="java.util.Date"/>
<jsp:setProperty name="dateValue" property="time"/>

<head>
    <meta charset="utf-8"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport"
          content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta content="telephone=no" name="format-detection"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1"/>
    <meta http-equiv="X-UA-Compatible" content="IE=9"/>
    <title>红包详情</title>
    <link rel="stylesheet" type="text/css" href="${path}/static/css/common.css"/>
    <style type="text/css">
        img {
            object-fit: cover;
        }
    </style>
</head>
<body>
<div style="background: url('${path}/static/images/QQ图片20181101163507.png');background-size: 100% 100%;height: 200px;"
     class="Y-position-relative">
    <div class="Y-text-align-center Y-font-color-white Y-font-size-16 Y-padding-vertical-top-25">红包详情
    </div>
    <c:if test="${map.number==map.allNumber}">
        <div class="Y-text-align-center Y-font-color-white Y-font-size-16 Y-padding-vertical-top-25">红包已抢完
        </div>
    </c:if>
    <c:if test="${map.number!=map.allNumber}">
        <div class="Y-text-align-center Y-font-color-white Y-font-size-16 Y-padding-vertical-top-25">总金额<span
                class="Y-font-size-26 Y-padding-horizontal-both-5">${map.allMoney}</span>元
        </div>
    </c:if>
    <div class="Y-position-absolute" style="top: 70%;left:50%;width:50%;margin-left: -25%;">
        <img src="http://www.taoshunda.com/images/${map.companyHeadPic}" height="50" width="50" alt=""
             style="margin:auto;"/>
        <div class="Y-font-size-16 Y-text-align-center Y-padding-vertical-top-15">${map.bussName}</div>
    </div>
</div>
<div class="Y-text-align-center Y-font-size-16" style="margin-top:35px;">
    ${map.content}
</div>
<div class="Y-padding-horizontal-both-10">
    <div id="redMessage"
         class="Y-font-color-999 Y-border-vertical-bottom-after Y-padding-vertical-bottom-10 Y-padding-vertical-top-20 Y-font-size-16">
        ${map.redMessage}
    </div>
</div>
<div class="Y-padding-horizontal-both-10" style="margin-bottom: 60px">
<c:if test="${map.redPacketListHistory!='[]'}">
    <c:forEach items="${map.redPacketListHistory}" var="history">

            <div class="Y-flexbox-horizontal Y-padding-vertical-both-10">
                <div class="Y-vertical-middle"><img src="http://www.taoshunda.com/images/${history.userHeadPic}" height="50" width="50" alt=""
                                                    class="Y-border-radius"/></div>
                <div class="Y-padding-horizontal-left-15 Y-flex-item">
                    <div class="Y-font-size-16 Y-flexbox-horizontal">
                        <div class="Y-text-show-row-1 Y-flex-item">${history.userName}</div>
                        <div class="Y-font-size-18 Y-text-align-right Y-font-weight-bold">${history.userMoney}元</div>
                    </div>
                    <div class="Y-flexbox-horizontal Y-padding-vertical-top-5">
                        <div class="Y-font-color-999 Y-font-size-14 Y-flex-item Y-text-show-row-1">
                            <fmt:formatDate value="${history.userTime}" pattern="yyyy-MM-dd HH:mm:ss"/>
                                </div>
                        <c:if test="${history.isFirst==1}">
                            <div style="color:red;" class="Y-text-align-right Y-font-size-12">
                                <img src="${path}/static/images/QQ图片20181101163530.png" width="10" alt=""
                                     class="Y-vertical-align-middle Y-display-inline-block Y-margin-horizontal-right-5 Y-margin-vertical-bottom-5"/>手速最快
                            </div>
                        </c:if> <c:if test="${history.isMax==1}">
                        <div style="color:green;" class="Y-text-align-right Y-font-size-12">
                            <img src="${path}/static/images/QQ图片20181101163523.png" width="18" alt=""
                                 class="Y-vertical-align-middle Y-display-inline-block Y-margin-horizontal-right-5 Y-margin-vertical-bottom-5"/>手气最佳
                        </div>
                        </c:if>


                    </div>
                </div>
            </div>

    </c:forEach>
</div>

</c:if>


<div style="background: #FF6D13;line-height:50px;text-align: center;display: inline-block;position: fixed;bottom: 0;width: 100%;font-size: 16px; margin-top: 50px">
    <button style="width: 100%; line-height:50px;background: #FF6D13;" id="btn"
            location="
    'http://www.taoshunda.com/setup/user.html'
    "><a
            href="http://www.taoshunda.com/setup/user.html" id="link"
            style="color: #ffffff;">点击下载淘瞬达app，淘您所爱 一瞬即达</a>
    </button>
</div>
</body>
<script>
    document.getElementById("btn").onclick = function () {
        document.getElementById("link").click();
    }
</script>